import React from 'react';
import styles from './index.module.css';
import CustomIcon from '@/components/CustomIcon';

export default function ImagePreview(props: {
  onHide: () => void;
  src: any;
}) {
  const {
    onHide = () => {},
    src,
  } = props;
  return (
    <div
      className={styles.imgPreviewingMask}
      onClick={onHide}
    >
      <div
        className={styles.imgPreviewingContainer}
      >
        <div style={{ alignSelf: 'flex-end' }}>
          <div
            className={styles.imgPreviewingCloseBtn}
            onClick={onHide}
          >
            <CustomIcon type="icon-projectOfalse-line" />
          </div>
        </div>
        <div>
          <img
            src={src}
            className={styles.previewingImg}
          />
        </div>
      </div>
    </div>
  );
}
